<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>排序算法</title>
    <style>
        .curr-num {
            color: red;
        }
    </style>
</head>
<body>
<div id="arrDiv"></div>

<script src="docHelper.js"></script>
<script>

    var nums = [4, 2, 1, 6, 3, 7, 9, 3, 5, 8];
    var arrDiv = document.getElementById("arrDiv");

    var sortHelper = function () {


        //插入排序
        function insertSort(arr) {
            var insertNum;
            for (var i = 1; i < arr.length; i++) {
                insertNum = arr[i];

                for (var j = i - 1; j >= 0; j--) {//从后往前遍历。大于insertNum的数向后移动
                    if (arr[j] > insertNum) {
                        arr[j + 1] = arr[j];
                    } else {
                        break;
                    }
                }
                arr[j + 1] = insertNum;
                printNums(arr, i);
            }
        }

        //插入排序
        function insertSort2(arr) {
            var insertNum;
            var j;
            for (var i = 1; i < arr.length; i++) {
                insertNum = arr[i];
                j = i - 1;
                while (j >= 0 && arr[j] > insertNum) {//从后往前遍历。大于insertNum的数向后移动
                    arr[j + 1] = arr[j];//往后移动
                    j--;
                }
                arr[j + 1] = insertNum;
                printNums(arr, i);
            }
        }

        //选择排序：简单选择排序。选出未排组中最小的值，交换到排序组末尾
        function selectSort(arr) {

            for (var i = 0; i < arr.length; i++) {
                var position = i;
                var min = arr[i];
                for (var j = i + 1; j < arr.length; j++) {//找到最小的值和位置
                    if (min > arr[j]) {
                        min = arr[j];
                        position = j;
                    }
                }
                // var min = arr[position];
                //将最小的值交换到i位
                arr[position] = arr[i];
                arr[i] = min;
                // printNums(arr,i)
            }
            printNums(arr, 1);
        }

        //选择排序：交换排序。遍历未排序组，与排序组末尾值进行比较，大/小时，进行交换。
        function selectSort2(arr) {

            for (var i = 0; i < arr.length; i++) {

                for (var j = i + 1; j < arr.length; j++) {

                    if (arr[j] < arr[i]) {//不停交换，直到将组中最小/大的数移动到i位
                        var temp = arr[i];
                        arr[i] = arr[j];
                        arr[j] = temp;
                    }
                }
                printNums(arr, i);
            }
        }

        //冒泡排序
        function bubbleSort(arr) {

            for (var i = 0; i < arr.length; i++) {

                for (var j = 0; j < arr.length - i - 1; j++) {
                    if (arr[j] > arr[j + 1]) {//每轮都将最大的数排到数组末尾。好像冒泡一样冒上去
                        var temp = arr[j];
                        arr[j] = arr[j + 1];
                        arr[j + 1] = temp;
                    }
                }

                printNums(arr, i);

            }

        }

        return {
            insertSort,
            insertSort2,
            selectSort,
            selectSort2,
            bubbleSort
        }
    }

    sortHelper().bubbleSort(nums);

</script>
</body>
</html>